<template>
  <div class="lofi-card h-full min-h-[calc(100vh-100px)]">
    <div class="mb-6">
      <h2 class="text-xl font-bold mb-4 handwritten">欢迎使用 FlowMind</h2>
      <p class="text-sm mb-4">在这里创建、编辑和分享你的流程图与思维导图</p>
      
      <div class="flex flex-wrap gap-3 mb-6">
        <button class="lofi-btn flex items-center">
          <i class="fa fa-file-o mr-2"></i> 新建流程图
        </button>
        <button class="lofi-btn flex items-center">
          <i class="fa fa-sitemap mr-2"></i> 新建思维导图
        </button>
        <button class="lofi-btn flex items-center">
          <i class="fa fa-folder-open-o mr-2"></i> 打开文件
        </button>
      </div>
    </div>
    
    <div class="border-t-2 border-dashed border-lofi-brown/30 pt-4">
      <h3 class="text-lg font-bold mb-3 handwritten">最近项目</h3>
      
      <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
        <ProjectCard 
          title="项目规划图" 
          type="流程图" 
          date="2天前" 
          icon="fa-flowchart"
        />
        <ProjectCard 
          title="思维导图-想法" 
          type="思维导图" 
          date="1周前" 
          icon="fa-sitemap"
        />
        <ProjectCard 
          title="流程设计" 
          type="流程图" 
          date="2周前" 
          icon="fa-exchange"
        />
      </div>
    </div>
  </div>
</template>

<script setup>
import ProjectCard from './ProjectCard.vue'
</script>